<template>
  <a-modal
    v-model:visible="visible"
    draggable
    width="500px"
    @before-ok="handleBeforeOk"
    @cancel="cancelMethod"
  >
    <template #title>
      {{
        formData.id
          ? `${$t('columns.operations.edit')}`
          : `${$t('searchTable.operation.create')}`
      }}数据运维</template
    >
    <a-form
      v-if="formData.id"
      ref="formRef"
      :model="formData"
      class="form"
      :label-col-props="{ span: 6 }"
      :wrapper-col-props="{ span: 18 }"
    >
      <a-form-item
        field="cardId"
        label="身份证"
        :rules="[{ required: true, message: '请输入身份证' }]"
      >
        <a-input
          v-model="formData.cardId"
          placeholder="请输入身份证"
          disabled
        />
      </a-form-item>
      <a-form-item
        field="name"
        label="居民姓名"
        :rules="[{ required: true, message: '请输入居民姓名' }]"
      >
        <a-input
          v-model="formData.name"
          placeholder="请输入居民姓名"
          disabled
        />
      </a-form-item>
      <a-form-item
        field="dealerName"
        label="处理人姓名"
        :rules="[{ required: true, message: '请输入处理人姓名' }]"
      >
        <a-input
          v-model="formData.dealerName"
          placeholder="请输入处理人姓名"
          disabled
        />
      </a-form-item>
      <a-form-item
        field="remark"
        label="处理说明"
        :rules="[{ required: true, message: '请输入处理说明' }]"
      >
        <a-input
          v-model="formData.remark"
          placeholder="请输入处理说明"
        />
      </a-form-item>
    </a-form>
    <a-form
      v-else
      ref="formRef"
      :model="formData"
      class="form"
      :label-col-props="{ span: 6 }"
      :wrapper-col-props="{ span: 18 }"
    >
      <a-form-item
        field="cardId"
        label="身份证"
        :rules="[{ required: true, message: '请输入身份证' }]"
      >
        <a-input
          v-model="formData.cardId"
          placeholder="请输入身份证"
        />
      </a-form-item>
      <a-form-item
        field="name"
        label="居民姓名"
        :rules="[{ required: true, message: '请输入居民姓名' }]"
      >
        <a-input
          v-model="formData.name"
          placeholder="请输入居民姓名"
        />
      </a-form-item>
      <a-form-item
        field="questionerName"
        label="提问者姓名"
        :rules="[{ required: true, message: '请输入提问者姓名' }]"
      >
        <a-input
          v-model="formData.questionerName"
          placeholder="请输入提问者姓名"
          disabled
        />
      </a-form-item>
      <a-form-item
        field="question"
        label="问题描述"
        :rules="[{ required: true, message: '请输入问题描述' }]"
      >
        <a-input
          v-model="formData.question"
          placeholder="请输入问题描述"
        />
      </a-form-item>
    </a-form>
  </a-modal>
</template>

<script lang="ts" setup>
  import { ref } from 'vue';
  import { Message } from '@arco-design/web-vue';
  import {
    tDictPage,
    TDictVO, tOpsAdd, tOpsDetail, TOpsDTO, tOpsUpdate, TOpsVO,
    TUser,
    TUserDTO,
    useCreate,
    useDetail,
    useUpdate
  } from "@/api/subsidy";
  import { useUserStore } from "@/store";

  defineProps({
    title: {
      type: String,
      default: '人员管理',
    },
  });
  const formRef = ref();
  const visible = ref(false);
  const menuOptions = ref([
    '数据字典',
    '用户管理',
    '补贴周期维护',
    '居民享受记录',
    '劳动子系统导入',
  ]);
  const userStore = useUserStore();
  const formData = ref<TOpsDTO>({
    cardId: "", dealerName: "", id: "", name: "", question: "", questionerName: "", remark: "", status: ""
  });
  const getUserMethod = async (id: string) => {
    const { data } = await tOpsDetail(id);
    formData.value = data;
    formData.value.dealerName = userStore.userInfo.user.name;
  };
  function handleChangeVisible(obj: TOpsVO) {
    debugger
    visible.value = !visible.value;
    if (obj){
      getUserMethod(obj.id);
    }else {
      formData.value.questionerName = userStore.userInfo.user.name;
    }
  }
  const cancelMethod = () => {
    visible.value = false;
  };
  const emit = defineEmits(['refresh']);

  function handleBeforeOk(done: any) {
    formRef.value.validate((valid: any) => {
      if (valid) {
        done(false);
      } else if (formData.value.id !== '') {
        formData.value.status = '已解决'
        tOpsUpdate(formData.value)
          .then(() => {
            Message.success('操作成功');
            emit('refresh');
            done();
          })
          .catch(() => {
            done(false);
          });
      } else {
        formData.value.status = '待解决'
        tOpsAdd(formData.value)
          .then(() => {
            Message.success('操作成功');
            emit('refresh');
            done();
          })
          .catch(() => {
            done(false);
          });
      }
    });
  }
  defineExpose({ handleChangeVisible });
</script>
